<template>
  <div>
    <div class="title-css" style="text-align: center;padding: 20px 0;">
      快递站点端 - 下一站查询
    </div>

    <div style="margin: 20px;"></div>
    <div>
      <el-form label-width="80px" :model="form">
        <el-form-item label="订单号">
          <el-input v-model="form.id"></el-input>
        </el-form-item>
        <el-form-item label="当前地址">
          <el-input v-model="form.address"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="queryNext()">查询</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div>下一站地址查询结果: {{ result }}</div>

  </div>
</template>

<script>

export default {
  data() {
    return {
      form: {
        id: '',
        address: '',
        tel: '',
      },
      result: '',     // 请求结果
    };
  },

  methods: {

    // 查询下一站信息
    queryNext() {
      // 为后端拼接数据
      let dtoBody = {
        "OrderId": this.form.id,
        "Node": this.form.address,
      }
      console.log("要向后端发送的数据: ", dtoBody)

      console.log("目的地: ", this.$store.getters.getDestination.destination)
      if (this.form.address === "中南民族大学"){
        this.result = "已是终点, 无下一站!";
      } else if (this.form.id === '' && this.form.address === '') {
        this.result = "请输入订单号和地址!";
      } else if (this.form.id === '') {
        this.result = "请输入订单号!";
      } else if (this.form.address === '') {
        this.result = "请输入地址!";
      } else {
        // 向后端发起post请求 获取下一站地址
        this.$axios.post("/express/getnextnode", dtoBody).then((res) => {
          console.log(res);

          // 将创建结果绑定到页面中
          if (res.data.data === "下一站地址不存在！"){
            this.result = "请输入正确的当前地址";
          } else {
            this.result = res.data.data;
          }

        }).catch((error) => {
          this.result = "请输入正确的订单号!";
          console.log(error);
          return false;
        })
      }


    },
  },
}
</script>

<style>

</style>